<!--
 * @Author: luoqi
 * @Date: 2022-04-17 20:45:50
 * @LastEditors: luoqi
 * @LastEditTime: 2022-05-03 18:26:09
 * @Description: 
-->
<template>
  <!-- 收藏历史记录 -->
  <el-row class="Ctogether">
    <el-col :span="24">
      <p>收藏历史记录</p>
      <el-row>
        <el-col :span="24">
          <el-row
            class="gugug"
            v-for="(item, index) in historyData"
            :key="index"
          >
            <el-col :span="18">
              <el-row>
                <el-col :span="3" class="height__60">
                  <i
                    v-if="item.typeName == '知识'"
                    :class="
                      'iconfontBox ' + 'bg_green ' + 'iconfont icon-zhishi'
                    "
                  ></i>
                  <i
                    v-else-if="item.typeName == '视频'"
                    :class="
                      'iconfontBox ' + 'bg_yellow ' + 'iconfont icon-video'
                    "
                  ></i>
                  <i
                    v-else-if="item.typeName == '疾病'"
                    :class="
                      'iconfontBox ' +
                      'bg_blue ' +
                      'iconfont icon-shiyuanxingjibing'
                    "
                  ></i>
                  <i
                    v-else
                    :class="
                      'iconfontBox ' +
                      'bg_blue ' +
                      'iconfont icon-gongzuojingyan'
                    "
                  ></i>
                </el-col>
                <el-col :span="19" class="text_headerline">
                  <div>{{ item.title }}</div>
                  <div>
                    <el-tag
                      type="success"
                      class="label"
                      v-for="(el, indexs) in item.tag && item.tag.split(',')"
                      :key="indexs + '2'"
                      >{{ el }}</el-tag
                    >
                  </div>
                </el-col>
              </el-row>
            </el-col>
            <el-col :span="6" class="dates">
              <span>{{ item.typeName }}</span>
              <span>{{ item.collectionTime }}</span>
            </el-col>
          </el-row>
        </el-col>
      </el-row>
    </el-col>
  </el-row>
</template>

<script>
export default {
  props: ["collection"],
  data() {
    return {
      //收藏历史记录数据
      historyData: [],
    };
  },
  watch: {
    collection(newData, old) {
      if (newData) {
        if (this.$route.path == "/main/MyHome/myhistory") {
          this.historyData = this.$store.state.mySelect.historyList;
        } else {
          this.historyData = this.$store.state.herData.collection.historyList;
        }
      }
    },
  },
  created() {
    if (this.$route.path == "/main/MyHome/myhistory") {
      this.historyData = this.$store.state.mySelect.historyList;
    } else {
      this.historyData = this.$store.state.herData.collection.historyList;
    }
  },
};
</script>

<style lang="less" scoped>
@import url("../../less/myhome.less");
</style>